<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <style type="text/css">
		.nav {
			background-color: pink;
		}
		.nav div {
			width: 200px;
			height: 200px;
			background-color: red;
			float: left;

		}
		.footer {
			width: 500px;
			height: 300px;
			background-color: black;
		}
        /* .clearfix:after {//单伪元素清除
        	content: ".ss";
        	display: block;
        	height: 0;
        	clear: both;
        	visibility: hidden;

        } */
        /*双伪元素清除*/
        .clearfix:before,.clearfix:after {
        	content: "";
        	display: table;

        }
        .clearfix:after {
        	clear: both;
        }
        .clearfix {
        	*zoom: 1;
        }


        </style>
    </head>
    <body>
    <div class="nav clearfix">
    	<div></div>
    </div>
    <div class="footer"></div>
    </body>
</html>